﻿@model Web.BaseModel
@{
    ViewBag.Title = "Default";
}


<title>顾客列表</title>
<script src="~/js/jquery-1.6.2.min.js"></script>
<script src="/js/public_ajax.js" type="text/javascript"></script>
<link href="/css/common.css" rel="stylesheet" type="text/css" />
<link href="/css/UserManager.css" rel="stylesheet" type="text/css" />

<div class="pageTitle">
    <p><img src="/css/image/tubiao_28.png" />您的位置：<span>顾客列表</span></p>
</div>

<div class="queryConditionDiv">
    <div class="queryText">
        <span>姓名：</span>
        <input type="text" id="Name" class="textinput" />

        <span>电话：</span>
        <input type="text" id="Phone" class="textinput" />
    </div>

    <input id="btnSearch" type="button" value="" class="queryButton" />
</div>

<div class="List_head">
    <div class="head_left"></div>
    <div class="head_bj">
        <div class="xiangxi">顾客列表</div>
        <a class="xinZeng" href="Edit"></a>
    </div>
    <div class="head_right"></div>
</div>

<div class="list_table" id="divTabel">
    <table class="dataShowTable" id="tb">
        <tr>
            <th>姓名</th>
            <th>编号</th>
            <th>电话</th>
            <th></th>
        </tr>

    </table>

    <div id="BOX_overlay">
        <div id="ajaxinfo"></div>
    </div>
</div>
<div id="divHidden">
    <input type="hidden" id="strWhere" />
    <input type="hidden" id="PageIndex" value="1" />
    <input type="hidden" id="TotalPages" value="1" />
</div>
<script type="text/javascript">
    var UrlAction = '@Url.Action("GetCustomer")';
    $(function () {//页面加载完成执行
        getDataDrawTable("", 1, UrlAction);
        $("#btnSearch").click(search);
    });
    function turnPage(pageIndex) {
        getDataDrawTable($("#strWhere").val(), pageIndex, UrlAction);
    }
    function del(self) {
        var id = $(self).parent().parent().attr('id');
        $.ajax({
            url: '@Url.Action("Delete")',
            data: { id: id },
            type: "POST",
            dataType: 'text',
            success: function (data) {
                var res = eval('(' + data + ')');
                if (res.result) {
                    turnPage(parseInt($("#PageIndex").val()));
                } else {
                    alert(res.des);
                }
            },
            error: function (xhr, textStatus, error) {
                alert(error);
            }
        });
    }

    function search() {
        var strWhere = "";
        var Name = $("#Name").val();
        var Phone = $("#Phone").val();
        if ($.trim(Name) != "")
            strWhere += " AND Name LIKE '%" + Name + "%'";
        if ($.trim(Phone) != "")
            strWhere += " AND Phone LIKE '%" + Phone + "%'";

        getDataDrawTable(strWhere, 1, UrlAction);
    }

    function homePage() {
        turnPage(1);
    }
    function previousPage() {
        turnPage(parseInt($("#PageIndex").val()) - 1);
    }
    function nextPage() {
        turnPage(parseInt($("#PageIndex").val()) + 1);
    }
    function endPage() {
        turnPage(parseInt($("#TotalPages").val()));
    }

    function getDataDrawTable(strWhere, pageIndex, actionUrl) {
        $.ajax({
            url: actionUrl,
            data: { strWhere: strWhere, pageIndex: pageIndex },
            type: "POST",
            dataType: 'text',
            success: function (data) {
                var pageTable = eval('(' + data + ')');
                drawTable(pageTable.DataTable);
                MakePagination(pageTable);
            },
            error: function (xhr, textStatus, error) {
                alert(error);
            }
        });
    }

    function drawTable(list) {//success的回调函数
        removeAll("tb");
        var table = $("#tb");
        for (var i = 0; i < list.length; i++) {
            var tr = $("<tr>");
            tr.attr('id', list[i]["Id"]);

            tr.append($("<td class=''>" + format(list[i]["CustomerName"]) + "</td>"));
            tr.append($("<td class=''>" + format(list[i]["CustomerNumber"]) + "</td>"));
            tr.append($("<td class=''>" + format(list[i]["Phone"]) + "</td>"));

            tr.append($("<td class=''>"
                + "<a href='Edit?Id=" + list[i]["CustomerId"] + "'>修改</a>"
                + "<a href='javascript:void(0)' onclick='del(this)'>删除</a>"
                + "</td>"));
            tr.appendTo(table);
        }
    }

    function MakePagination(pageTable) {
        var TotalCount = pageTable.TotalCount;//总记录数
        var PageSize = pageTable.PageSize;//每页记录数

        var HasPreviousPage = pageTable.HasPreviousPage;//是否有上一页
        var HasNextPage = pageTable.HasNextPage;//是否有下一页
        var PageIndex = pageTable.PageIndex;//当前页
        var TotalPages = pageTable.TotalPages;//总页数

        $("#PageIndex").val(PageIndex);
        $("#TotalPages").val(TotalPages);

        var strHomePagePreviousPage = "<a href='javascript:void(0)' onclick='homePage()'>首页</a>"
                                    + "<a href='javascript:void(0)' onclick='previousPage()'>"
                                        + "<img src='../css/image/tubiao_47.png' class='list-IMG' />"
                                    + "</a>";
        var strNextPageEndPage = "<a href='javascript:void(0)' onclick='nextPage()'>"
                                        + "<img src='../css/image/tubiao_50.png' class='list-IMG' />"
                                    + "</a>"
                                    + "<a href='javascript:void(0)' onclick='endPage()'>尾页</a>";
        strHomePagePreviousPage = HasPreviousPage ? strHomePagePreviousPage : "";
        strNextPageEndPage = HasNextPage ? strNextPageEndPage : "";

        var strPagination = "<div class='list-YeMa' id='divYeMa'>"
                                + "<span class='JILU'>共 " + TotalCount + " 条记录，每页 " + PageSize + " 条</span>"
                                + "<div class='TiaoZhuan'>"
                                    + strHomePagePreviousPage
                                    + "<span class='currentPageSpan'>" + PageIndex + "/" + TotalPages + "页</span>"
                                    + strNextPageEndPage
                                + "</div>"
                            + "</div>";
        $("#divYeMa").remove();
        $(strPagination).appendTo($("#divTabel"));
    }
    //utility-------------------------------------------------------------------------------
    function removeAll(tableId) {//清除table已有的内容
        $("#" + tableId + " tr:not(:first)").remove();
    }

    function format(value) {
        return value == null ? "" : value;
    }

</script>
